<!DOCTYPE html>
<script src="../../../resources/testharness.js"></script>
<script src="../../../resources/testharnessreport.js"></script>
<style>
.t1 .sibling + *,
.t2 .sibling ~ *,
.t3 .sibling + :hover,
.t4 + .sibling,
.t5 + *,
.t6 ~ .sibling,
.t7 + * + * .child,
.t8 + :-webkit-any(.sibling) * { background-color: rgb(0, 128, 0); }

#r3 { width: 10px; height: 10px }
</style>
<div>
    <div id="t1">
        <div class="sibling"></div>
        <div id="r1"></div>
    </div>
</div>
<div>
    <div id="t2">
        <div class="sibling"></div>
        <div></div>
        <div id="r2"></div>
    </div>
</div>
<div>
    <div id="t3">
        <div class="sibling"></div>
        <div id="r3"></div>
    </div>
</div>
<div>
    <div id="t4"></div>
    <div id="r4" class="sibling">
        <div></div>
        <div></div>
    </div>
    <div class="sibling"></div>
</div>
<div>
    <div id="t5"></div>
    <div id="r5">
        <div></div>
        <div></div>
    </div>
    <div></div>
</div>
<div>
    <div id="t6"></div>
    <div></div>
    <div id="r6" class="sibling">
        <div></div>
        <div></div>
    </div>
    <div></div>
</div>
<div>
    <div id="t7">
        <div class="child"></div>
    </div>
    <div>
        <div class="child"></div>
        <div></div>
    </div>
    <div>
        <div id="r7" class="child"></div>
        <div></div>
    </div>
    <div>
        <div class="child"></div>
    </div>
</div>
<div>
    <div id="t8"></div>
    <div class="sibling">
        <div id="r8"></div>
    </div>
</div>
<script>
document.body.offsetTop;

test(function() {
    assert_true(!!window.internals, "This test only works with internals exposed present");
}, "internals are exposed");

test(function() {
    assert_equals(getComputedStyle(r1).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t1.className = "t1";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3, "Subtree style recalc");
    assert_equals(getComputedStyle(r1).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Adjacent with universal selector");

test(function() {
    assert_equals(getComputedStyle(r2).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t2.className = "t2";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 4, "Subtree style recalc");
    assert_equals(getComputedStyle(r2).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Indirect adjacent with universal selector");

test(function() {
    assert_true(!!window.eventSender, "This test only works with eventSender present");

    eventSender.mouseMoveTo(r3.offsetLeft + 1, r3.offsetTop + 1);
    assert_equals(getComputedStyle(r3).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t3.className = "t3";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 3, "Subtree style recalc");
    assert_equals(getComputedStyle(r3).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Adjacent with universal :hover selector");

test(function() {
    assert_equals(getComputedStyle(r4).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t4.className = "t4";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Subtree style recalc");
    assert_equals(getComputedStyle(r4).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Class change affecting selector for sibling class");

test(function() {
    assert_equals(getComputedStyle(r5).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t5.className = "t5";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Subtree style recalc");
    assert_equals(getComputedStyle(r5).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Class change affecting all sibling subtrees through a universal selector");

test(function() {
    assert_equals(getComputedStyle(r6).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t6.className = "t6";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 1, "Subtree style recalc");
    assert_equals(getComputedStyle(r6).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Class change affecting all sibling subtrees through an indirect adjacent combinator");

test(function() {
    assert_equals(getComputedStyle(r7).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t7.className = "t7";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2, "Subtree style recalc");
    assert_equals(getComputedStyle(r7).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Class change affecting sibling descendants through a universal selector");

test(function() {
    assert_equals(getComputedStyle(r8).backgroundColor, "rgba(0, 0, 0, 0)", "Background color should initially be transparent");

    t8.className = "t8";
    assert_equals(internals.updateStyleAndReturnAffectedElementCount(), 2, "Subtree style recalc");
    assert_equals(getComputedStyle(r8).backgroundColor, "rgb(0, 128, 0)", "Background color is green after class change");
}, "Class change affecting universal descendants of webkit-any sibling");

</script>
